extends ../_layout

block active
  - sidebar_active = 'dashboard_v2.html'

block content
  .content-heading
    // START Language list
    .pull-right
      .btn-group
        button.btn.btn-default(type='button', data-toggle="dropdown") English
        ul.dropdown-menu.dropdown-menu-right.animated.fadeInUpShort(role='menu')
          li
            a(href='#', data-set-lang="en") English
          li
            a(href='#', data-set-lang="es") Spanish
    // END Language list    

    | Dashboard
    small(data-localize="dashboard.WELCOME") 

  .row
    .col-lg-4
      // START List group
      ul.list-group
          li.list-group-item
            .row.row-table.pv-lg
              .col-xs-6
                p.m0.lead 1204
                p.m0: small Commits this month
              .col-xs-6.text-center
                div(data-sparkline="", data-bar-color="#23b7e5", data-height="60", data-bar-width="10", data-bar-spacing="6", data-chart-range-min="0", values="3,6,7,8,4,5")
          li.list-group-item 
            .row.row-table.pv-lg
              .col-xs-6
                p.m0.lead $ 3,200.00
                p.m0: small Available budget
              .col-xs-6.text-center
                div(data-sparkline="",data-type='line', data-height='60', data-width='80%', data-line-width='2', data-line-color="#7266ba", data-chart-range-min="0",data-spot-color='#888', data-min-spot-color="#7266ba", data-max-spot-color="#7266ba", data-fill-color='', data-highlight-line-color='#fff', data-spot-radius='3', values="7,3,4,7,5,9,4,4,7,5,9,6,4", data-resize="true")
          li.list-group-item 
            .row.row-table.pv-lg
              .col-xs-6
                p.m0.lead 67
                p.m0: small New followers
              .col-xs-6
                ul.list-inline.text-center
                  li: a(href="#", tooltip="Katie"): img.img-responsive.img-circle.thumb24(src="img/user/02.jpg", alt="Follower")
                  li: a(href="#", tooltip="Cody"): img.img-responsive.img-circle.thumb24(src="img/user/01.jpg", alt="Follower")
                  li: a(href="#", tooltip="Tamara"): img.img-responsive.img-circle.thumb24(src="img/user/03.jpg", alt="Follower")
                  li: a(href="#", tooltip="Gene"): img.img-responsive.img-circle.thumb24(src="img/user/04.jpg", alt="Follower")
                  li: a(href="#", tooltip="Marsha"): img.img-responsive.img-circle.thumb24(src="img/user/04.jpg", alt="Follower")
                  li: a(href="#", tooltip="Robin"): img.img-responsive.img-circle.thumb24(src="img/user/09.jpg", alt="Follower")
      // END List group
    .col-lg-8
      // START bar chart
      #panelChart3.panel
        .panel-heading
          // START button group
          .pull-right.btn-group
            button(type="button", data-toggle="dropdown").dropdown-toggle.btn.btn-default.btn-sm
              | Monthly
            ul.dropdown-menu.fadeInLeft.animated(role='menu')
              li
                a(href='#') Daily
              li
                a(href='#') Monthly
              li
                a(href='#') Yearly
          // END button group
          .panel-title Projects Hours
        .panel-wrapper(collapse="panelChart3")
          .panel-body
            .indicator.show
              span.spinner
            .chart-bar-stackedv2.flot-chart
      // END bar chart

  .unwrap.mv-lg
    // START chart
    #panelChart9.panel(ng-controller="FlotChartController")
      .panel-heading
        // START button group
        .pull-right.btn-group
          button(type="button", data-toggle="dropdown").dropdown-toggle.btn.btn-default.btn-sm
            | All time
          ul.dropdown-menu.fadeInLeft.animated(role='menu')
            li
              a(href='#') Daily
            li
              a(href='#') Monthly
            li.divider
            li
              a(href='#') All time
        // END button group
        .panel-title Overall progress
      .panel-wrapper(collapse="panelChart9")
        .panel-body
          .chart-splinev2.flot-chart
        .panel-body
          .row
            .col-sm-3.col-xs-6.text-center
              p Projects
              .h1 25
            .col-sm-3.col-xs-6.text-center
              p Teammates
              .h1 85
            .col-sm-3.col-xs-6.text-center
              p Hours
              .h1 380
            .col-sm-3.col-xs-6.text-center
              p Budget
              .h1 $ 10,000.00
    // END chart

  // START radial charts
  .row.mb-lg
    .col-sm-3.col-xs-6.text-center
      p Current Project
      canvas(data-classyloader="", data-height="150px", data-diameter="60", data-font-size="25px", data-percentage="60", data-speed="30", data-line-color="#23b7e5", data-remaining-line-color="#edf2f6", data-line-width="2")
    .col-sm-3.col-xs-6.text-center
      p Current Progress
      canvas(data-classyloader="", data-height="150px", data-diameter="60", data-font-size="25px", data-percentage="30", data-speed="30", data-line-color="#f532e5", data-remaining-line-color="#edf2f6", data-line-width="2")
    .col-sm-3.col-xs-6.text-center
      p Space Usage
      canvas(data-classyloader="", data-height="150px", data-diameter="60", data-font-size="25px", data-percentage="50", data-speed="30", data-line-color="#7266ba", data-remaining-line-color="#edf2f6", data-line-width="2")
    .col-sm-3.col-xs-6.text-center
      p Interactions
      canvas(data-classyloader="", data-height="150px", data-diameter="60", data-font-size="25px", data-percentage="75", data-speed="30", data-line-color="#ff902b", data-remaining-line-color="#edf2f6", data-line-width="2")
  // START radial charts

  // START Multiple List group
  .list-group
    a(href="#").list-group-item
      table.wd-wide
        tbody: tr
          td.wd-xs
            .ph
              img.media-box-object.img-responsive.img-rounded.thumb64(src="img/dummy.png", alt="")
          td
            .ph
              h4.media-box-heading Project A
              small.text-muted Vestibulum ante ipsum primis in faucibus orci
          td.wd-sm.hidden-xs.hidden-sm
            .ph
              p.m0 Last change
              small.text-muted 4 weeks ago
          td.wd-xs.hidden-xs.hidden-sm
            .ph
              p.m0.text-muted
                em.icon-users.mr.fa-lg
                | 26
          td.wd-xs.hidden-xs.hidden-sm
            .ph
              p.m0.text-muted
                em.icon-doc.mr.fa-lg
                | 3500
          td.wd-sm
            .ph
              progressbar.m0.progress-xs(value='80', type='success') 80%
  .list-group
    a(href="#").list-group-item
      table.wd-wide
        tbody: tr
          td.wd-xs
            .ph
              img.media-box-object.img-responsive.img-rounded.thumb64(src="img/dummy.png", alt="")
          td
            .ph
              h4.media-box-heading Project X
              small.text-muted Vestibulum ante ipsum primis in faucibus orci
          td.wd-sm.hidden-xs.hidden-sm
            .ph
              p.m0 Last change
              small.text-muted Today at 06:23 am
          td.wd-xs.hidden-xs.hidden-sm
            .ph
              p.m0.text-muted
                em.icon-users.mr.fa-lg
                | 3
          td.wd-xs.hidden-xs.hidden-sm
            .ph
              p.m0.text-muted
                em.icon-doc.mr.fa-lg
                | 150
          td.wd-sm
            .ph
              progressbar.m0.progress-xs(value='50', type='purple') 50%
  .list-group
    a(href="#").list-group-item
      table.wd-wide
        tbody: tr
          td.wd-xs
            .ph
              img.media-box-object.img-responsive.img-rounded.thumb64(src="img/dummy.png", alt="")
          td
            .ph
              h4.media-box-heading Project Z
              small.text-muted Vestibulum ante ipsum primis in faucibus orci
          td.wd-sm.hidden-xs.hidden-sm
            .ph
              p.m0 Last change
              small.text-muted Yesterday at 10:20 pm
          td.wd-xs.hidden-xs.hidden-sm
            .ph
              p.m0.text-muted
                em.icon-users.mr.fa-lg
                | 15
          td.wd-xs.hidden-xs.hidden-sm
            .ph
              p.m0.text-muted
                em.icon-doc.mr.fa-lg
                | 480
          td.wd-sm
            .ph
              progressbar.m0.progress-xs(value='20', type='green') 20%



    // END dashboard main content
  // END Multiple List group

block vendor_css
  // WEATHER ICONS
  link(rel='stylesheet', href='../vendor/weather-icons/css/weather-icons.min.css')

block vendor_js
  // SPARKLINE
  script(src='../vendor/sparkline/index.js')
  // FLOT CHART
  script(src='../vendor/Flot/jquery.flot.js')
  script(src='../vendor/flot.tooltip/js/jquery.flot.tooltip.min.js')
  script(src='../vendor/Flot/jquery.flot.resize.js')
  script(src='../vendor/Flot/jquery.flot.pie.js')
  script(src='../vendor/Flot/jquery.flot.time.js')
  script(src='../vendor/Flot/jquery.flot.categories.js')
  script(src='../vendor/flot-spline/js/jquery.flot.spline.min.js')
  // CLASSY LOADER
  script(src='../vendor/jquery-classyloader/js/jquery.classyloader.min.js')
  // MOMENT JS
  script(src='../vendor/moment/min/moment-with-locales.min.js')
  // SKYCONS
  script(src='../vendor/skycons/skycons.js')
  // DEMO
  script(src='js/demo/demo-flot.js')
